<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
    <title>K12试听课预约平台</title>
    <link rel="stylesheet" href="../lib/fontawesome/all.min.css">
    <link rel="stylesheet" href="../lib/layer/theme/default/layer.css">
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="../css/order_list.css">
</head>
<body>

<div id = app>
    <!-- 页头 -->
    <div class="page-header">
        <div class="header-top">
            <a href="uc.html">
                <span>&lt;</span>
                <span>我的预约</span>
            </a>
        </div>
    </div>

    <!-- 页面主体 -->
    <div class="main-body">
        <ul class="order-list" v-for="o in orderList">
            <li class="order">
                <div class="o-time green">
                    <p class="time" v-text="o.time"></p>
                    <p class="date" v-text="o.date"></p>
                    <p class="status" v-if="o.status == 0">请赴约</p>
                    <p class="status" v-if="o.status == 1">请评价</p>
                    <p class="status" v-if="o.status == 2">已完成</p>
                    <p class="status" v-if="o.status == 3">已违约</p>
                </div>
                <div class="o-info">
                    <p class="mechanism" v-text="o.mechanism"></p>
                    <p class="service" v-text="o.service"></p>
                    <p class="address" v-text="o.address"></p>
                </div>
                <div class="action">
                    <button type="button" v-if="o.status == 0" @click="sign(o.id)">签到</button>
                    <button type="button" v-if="o.status == 1" @click="evaluate(o.id)">评价</button>
                </div>
            </li>

        </ul>

    </div>
    <!-- 页脚 -->
    <div class="page-foot">
        <div class="hr"></div>
        <span class="info">&copy;2019 软赢科技 版权所有</span>
    </div>

</div>

</body>
<script src="../lib/jquery.min.js"></script>
<script src="../lib/vue.min.js"></script>
<script src="../lib/layer/layer.js"></script>
<script src="../js/main.js"></script>
<script src="../js/uo_list.js"></script>
</html>